.index {
    min-height: 100vh;

    .mentor_header {
        max-width: 1000px;
        margin   : 0 auto;
        height   : 100%;

        .mentor_header_item {
            span {
                color      : #fff;
                font-size  : 16px;
                font-weight: bold;
            }

            .operate_btn {
                margin-left: 20px;
            }
        }

    }

    .mentor_container {
        max-width : 1000px;
        margin    : 0 auto;
        padding   : 0 20px;
        box-sizing: border-box;

        .explanation {
            width : 50%;
            margin: 0 auto;

            .explanation_item {
                padding      : 10px;
                box-sizing   : border-box;
                margin       : 20px 0;
                border-radius: 4px;
                box-shadow   : 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);
                font-size    : 16px;
                color        : #c00;

                div {
                    margin     : 5px;
                    line-height: 25px;

                    // span {
                    //     color: #c00;
                    // }
                }
            }
        }

        .apprenticeship {
            .apprenticeship_top {
                width : 45%;
                margin: 0 auto;

                .apprenticeship_tips {
                    line-height: 25px;
                    margin     : 15px 0;
                    font-size  : 14px;
                }
            }

            .recording_box {
                margin-top: 20px;
                padding   : 20px;
                box-sizing: border-box;
                border-top: 1px solid #ddd;

                .recording_item {
                    width        : 50%;
                    height       : 60px;
                    padding      : 0 20px;
                    box-sizing   : border-box;
                    line-height  : 60px;
                    margin       : 0 auto;
                    border-radius: 4px;
                    border       : 1px solid #ddd;
                    margin-top   : 14px;

                    .apply_time {
                        font-size: 10px;
                        color    : #909399;
                    }
                }
            }

        }

        .apprentice {
            width : 45%;
            margin: 0 auto;

            .log_box {
                .log_item {
                    padding      : 20px;
                    box-sizing   : border-box;
                    margin       : 15px 0;
                    border-radius: 8px;
                    border       : 1px solid #ddd;

                    .log_name {
                        color: #67C23A;
                    }

                    .expired_time {
                        font-size : 12px;
                        color     : #909399;
                        margin-top: 10px;
                    }
                }
            }
        }

        .details {
            width : 50%;
            margin: 0 auto;

            .log {
                .log_item {
                    border-radius: 8px;
                    border       : 1px solid #ddd;
                    padding      : 20px;
                    box-sizing   : border-box;
                    margin       : 15px 0;

                    .time {
                        margin-top: 10px;
                        font-size : 10px;
                        color     : #909399;
                    }

                    .price {
                        font-size  : 17px;
                        font-weight: bold;
                    }
                }
            }
        }
    }
}